<template>
  <el-drawer :title="model.id?'编辑数据点':'添加数据点'" :visible.sync="drawerVisible" :size="'650px'"
             custom-class="data-element-drawer">
    <div class="drawer-body">
      <el-form ref="dataForm" :rules="modelRules" :model="model" label-width="190px">
        <el-form-item label="数据点类型" prop="type">
          <el-select v-model="model.type" :disabled="!!model.id" placeholder="请选择" @change="typeChange">
            <el-option v-for="item in dataEleTypeOptions" :key="item.value" :label="item.label" :value="item.value">
            </el-option>
          </el-select>
        </el-form-item>
        <template>
          <el-divider>general 参数</el-divider>
          <el-form-item label="位号" prop="code">
            <el-input v-model="model.code" placeholder="位号"/>
          </el-form-item>
          <el-form-item label="指标编码" prop="itemCode">
            <el-input v-model="model.itemCode" placeholder="指标编码"/>
          </el-form-item>
          <el-form-item label="描述" prop="description">
            <el-input v-model="model.description" placeholder="描述"/>
          </el-form-item>
          <el-form-item v-if="model.type === 1 || model.type===6" label="单位" prop="unit">
            <el-input v-model="model.unit" placeholder="单位"/>
          </el-form-item>
          <el-form-item label="初始值" prop="defaultValue">
            <el-input v-model="model.defaultValue" placeholder="初始值"/>
          </el-form-item>
        </template>
        <template v-if="equipType===2 || equipType===3 || equipType===4 || equipType===5">
          <el-divider>modbus 解析参数</el-divider>
          <el-form-item label="功能码" prop="modbusFuncCode">
            <el-select v-model="model.modbusFuncCode" placeholder="请选择">
              <el-option v-for="item in modbusFuncCodeOptions" :key="item" :label="item" :value="item">
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="数据地址" prop="modbusDataAddr">
            <el-input-number v-model="model.modbusDataAddr" :controls="false" placeholder="数据地址"></el-input-number>
          </el-form-item>
          <el-form-item label="MODBUS解析数据类型" prop="modbusDataType">
            <el-select v-model="model.modbusDataType" :disabled="model.type===2" placeholder="请选择">
              <el-option
                v-for="item in modbusDataTypeOptions"
                :key="item.value"
                :disabled="model.type===1&&item.value===4"
                :label="item.label"
                :value="item.value">
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item
            v-if="model.type===2 && (model.modbusFuncCode===3 || model.modbusFuncCode===4 || model.modbusFuncCode===6 || model.modbusFuncCode===16)"
            label="数据位" prop="modbusDataShift">
            <el-input-number v-model="model.modbusDataShift" :controls="false" placeholder="数据位"></el-input-number>
          </el-form-item>
        </template>
        <template v-if="model.type===1 || model.type===2 || model.type===6">
          <el-divider>计算参数</el-divider>
          <template v-if="model.type===1 || model.type===6">
            <el-form-item label="取绝对值" prop="absoluteValue">
              <el-switch v-model="model.absoluteValue"></el-switch>
            </el-form-item>
            <el-form-item label="量程变换" prop="rangeTrans">
              <el-switch v-model="model.rangeTrans"></el-switch>
              <div v-if="model.rangeTrans" class="tips-text">LL+（源值-PRL）*（LH-LL）/（PRH-PRL）</div>
            </el-form-item>
            <el-form-item v-if="model.rangeTrans" label="裸数据上限(PRH)" prop="rawDataLH">
              <el-input v-model="model.rawDataLH" type="number" step="0.000001" placeholder="裸数据上限(PRH)"/>
            </el-form-item>
            <el-form-item v-if="model.rangeTrans" label="裸数据下限(PRL)" prop="rawDataLL">
              <el-input v-model="model.rawDataLL" type="number" step="0.000001" placeholder="裸数据下限(PRL)"/>
            </el-form-item>
            <el-form-item label="量程上限(LH)" prop="rangeLH">
              <el-input v-model="model.rangeLH" type="number" step="0.000001" placeholder="量程上限(LH)"/>
            </el-form-item>
            <el-form-item label="量程下限(LL)" prop="rangeLL">
              <el-input v-model="model.rangeLL" type="number" step="0.000001" placeholder="量程下限(LL)"/>
            </el-form-item>
            <el-form-item label="系数" prop="caculation">
              <el-switch v-model="model.caculation"></el-switch>
              <div v-if="model.caculation" class="tips-text">数值=基数+源值*倍数</div>
            </el-form-item>
            <el-form-item v-if="model.caculation" label="基数" prop="caculationBase">
              <el-input v-model="model.caculationBase" type="number" step="0.000001" placeholder="基数"/>
            </el-form-item>
            <el-form-item v-if="model.caculation" label="倍数" prop="caculationTimes">
              <el-input v-model="model.caculationTimes" type="number" min="0" placeholder="倍数"/>
            </el-form-item>

          </template>
          <template v-if="model.type===2">
            <el-form-item label="采集取反" prop="reverse">
              <el-switch v-model="model.reverse"></el-switch>
            </el-form-item>
            <el-form-item label="真值描述" prop="trueDesc">
              <el-input v-model="model.trueDesc" placeholder="真值描述"/>
            </el-form-item>
            <el-form-item label="假值描述" prop="falseDesc">
              <el-input v-model="model.falseDesc" placeholder="假值描述"/>
            </el-form-item>
          </template>
        </template>
        <!--<template v-if="model.type===1">
          <el-divider>容错参数</el-divider>
          <el-row>
            <el-col :span="10">
              <el-form-item label="零漂过滤" prop="zeroTolerant">
                <el-switch v-model="model.zeroTolerant"></el-switch>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="零漂过滤阈值" prop="zeroTolerantValue" label-width="120px">
                <el-input v-model.number="model.zeroTolerantValue" :disabled="!model.zeroTolerant" type="number" placeholder="零漂过滤阈值"/>
                <div class="tips-text">在0附近加减value为0值</div>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="10">
              <el-form-item label="跳变检测" prop="jumpTolerant">
                <el-switch v-model="model.jumpTolerant"></el-switch>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="跳变监测步进" prop="jumpTolerantValue" label-width="120px">
                <el-input v-model.number="model.jumpTolerantValue" :disabled="!model.jumpTolerant" placeholder="跳变监测步进"/>
                <div class="tips-text">大于步进值两次才认为正常</div>
              </el-form-item>
            </el-col>
          </el-row>
        </template>-->
        <template v-if="model.type===1 || model.type===2 || model.type===6">
          <el-divider>告警参数</el-divider>
          <el-form-item label="网关生成告警" prop="generateAlarm">
            <el-switch v-model="model.generateAlarm"></el-switch>
          </el-form-item>
          <template v-if="model.type===2 && model.generateAlarm">
            <el-form-item label="真值告警" prop="trueAlarm" label-width="258px">
              <el-switch v-model="model.trueAlarm"></el-switch>
            </el-form-item>
            <el-form-item label="假值告警" prop="falseAlarm" label-width="258px">
              <el-switch v-model="model.falseAlarm"></el-switch>
            </el-form-item>
          </template>
          <template v-if="model.type===1 || model.type===6">
            <el-form-item label="使用DCS报警" prop="useDCSAlarm">
              <el-switch v-model="model.useDCSAlarm" @change="useDCSChange"></el-switch>
            </el-form-item>
            <el-row v-if="!model.useDCSAlarm">
              <el-col :span="10">
                <el-form-item label="变化死区" prop="thresholdTolerant">
                  <el-switch v-model="model.thresholdTolerant" @change="thresholdTolerantChange"></el-switch>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item v-if="model.thresholdTolerant" label="" prop="thresholdTolerantRate" label-width="0">
                  <el-switch v-model="model.thresholdTolerantRate" active-text="百分比" inactive-text="数值"></el-switch>
                </el-form-item>
              </el-col>
            </el-row>
            <el-form-item v-if="model.thresholdTolerant&&!model.useDCSAlarm"
                          :label="model.thresholdTolerantRate?'变化死区阈值（%）':'变化死区阈值'" prop="thresholdTolerantValue">
              <el-input-number v-model="model.thresholdTolerantValue" :controls="false"
                               :placeholder="model.thresholdTolerantRate?'变化死区阈值（%）':'变化死区阈值'"></el-input-number>
            </el-form-item>
            <el-form-item v-if="!model.useDCSAlarm" label="告警窗口期（秒）" prop="timerThreshold">
              <el-input-number v-model="model.timerThreshold" :controls="false" :min="0"
                               placeholder="告警窗口期（秒）"></el-input-number>
            </el-form-item>
            <el-form-item v-if="!model.useDCSAlarm" label="是否重复告警" prop="multipleAlarm">
              <el-switch v-model="model.multipleAlarm"></el-switch>
            </el-form-item>
            <table class="alert-table">
              <tr>
                <th>应用告警</th>
                <th style="width: 40%">阈值</th>
                <th style="width: 20%">级别</th>
                <th style="width: 25%">自编码</th>
              </tr>
              <tr>
                <td>
                  <el-form-item label="产生高高高值告警" prop="criticalHighAlarm" label-width="120px">
                    <el-switch v-model="model.criticalHighAlarm" :disabled="!model.majorHighAlarm"></el-switch>
                  </el-form-item>
                </td>
                <td>
                  <el-form-item prop="criticalHighAlarmThreshold" label-width="0">
                    <el-input v-model="model.criticalHighAlarmThreshold" type="number" step="0.000001" placeholder="阈值"></el-input>
                  </el-form-item>
                </td>
                <td>
                  <el-form-item prop="criticalHighAlarmSeverity" label-width="0">
                    <el-input v-model="model.criticalHighAlarmSeverity" :min="0" :max="15" type="number"
                              placeholder="级别"></el-input>
                  </el-form-item>
                </td>
                <td>
                  <el-form-item prop="criticalHighAlarmCode" label-width="0">
                    <el-input v-model="model.criticalHighAlarmCode" placeholder="自编码"/>
                  </el-form-item>
                </td>
              </tr>
              <tr>
                <td>
                  <el-form-item label="产生高高值告警" prop="majorHighAlarm" label-width="120px">
                    <el-switch v-model="model.majorHighAlarm" :disabled="!model.highAlarm"></el-switch>
                  </el-form-item>
                </td>
                <td>
                  <el-form-item prop="majorHighAlarmThreshold" label-width="0">
                    <el-input v-model="model.majorHighAlarmThreshold" type="number" step="0.000001" placeholder="阈值"></el-input>
                  </el-form-item>
                </td>
                <td>
                  <el-form-item prop="majorHighAlarmSeverity" label-width="0">
                    <el-input v-model="model.majorHighAlarmSeverity" :min="0" :max="15" type="number"
                              placeholder="级别"></el-input>
                  </el-form-item>
                </td>
                <td>
                  <el-form-item prop="majorHighAlarmCode" label-width="0">
                    <el-input v-model="model.majorHighAlarmCode" placeholder="自编码"/>
                  </el-form-item>
                </td>
              </tr>
              <tr>
                <td>
                  <el-form-item label="产生高值告警" prop="highAlarm" label-width="120px">
                    <el-switch v-model="model.highAlarm" @change="highAlarmChange"></el-switch>
                  </el-form-item>
                </td>
                <td>
                  <el-form-item prop="highAlarmThreshold" label-width="0">
                    <el-input v-model="model.highAlarmThreshold" type="number" step="0.000001" placeholder="阈值"></el-input>
                  </el-form-item>
                </td>
                <td>
                  <el-form-item prop="highAlarmSeverity" label-width="0">
                    <el-input v-model="model.highAlarmSeverity" :min="0" :max="15" type="number"
                              placeholder="级别"></el-input>
                  </el-form-item>
                </td>
                <td>
                  <el-form-item prop="highAlarmCode" label-width="0">
                    <el-input v-model="model.highAlarmCode" placeholder="自编码"/>
                  </el-form-item>
                </td>
              </tr>
              <tr>
                <td>
                  <el-form-item label="产生低值告警" prop="lowAlarm" label-width="120px">
                    <el-switch v-model="model.lowAlarm" @change="lowAlarmChange"></el-switch>
                  </el-form-item>
                </td>
                <td>
                  <el-form-item prop="lowAlarmThreshold" label-width="0">
                    <el-input v-model="model.lowAlarmThreshold" type="number" step="0.000001" placeholder="阈值"></el-input>
                  </el-form-item>
                </td>
                <td>
                  <el-form-item prop="lowAlarmSeverity" label-width="0">
                    <el-input v-model="model.lowAlarmSeverity" type="number" :min="0" :max="15"
                              placeholder="级别"></el-input>
                  </el-form-item>
                </td>
                <td>
                  <el-form-item prop="lowAlarmCode" label-width="0">
                    <el-input v-model="model.lowAlarmCode" placeholder="自编码"/>
                  </el-form-item>
                </td>
              </tr>
              <tr>
                <td>
                  <el-form-item label="产生低低值告警" prop="majorLowAlarm" label-width="120px">
                    <el-switch v-model="model.majorLowAlarm" :disabled="!model.lowAlarm"></el-switch>
                  </el-form-item>
                </td>
                <td>
                  <el-form-item prop="majorLowAlarmThreshold" label-width="0">
                    <el-input v-model="model.majorLowAlarmThreshold" type="number" step="0.000001" placeholder="阈值"></el-input>
                  </el-form-item>
                </td>
                <td>
                  <el-form-item prop="majorLowAlarmSeverity" label-width="0">
                    <el-input v-model="model.majorLowAlarmSeverity" type="number" :min="0" :max="15"
                              placeholder="级别"></el-input>
                  </el-form-item>
                </td>
                <td>
                  <el-form-item prop="majorLowAlarmCode" label-width="0">
                    <el-input v-model="model.majorLowAlarmCode" placeholder="自编码"/>
                  </el-form-item>
                </td>
              </tr>
              <tr>
                <td>
                  <el-form-item label="产生低低低值告警" prop="criticalLowAlarm" label-width="120px">
                    <el-switch v-model="model.criticalLowAlarm" :disabled="!model.majorLowAlarm"></el-switch>
                  </el-form-item>
                </td>
                <td>
                  <el-form-item prop="criticalLowAlarmThreshold" label-width="0">
                    <el-input v-model="model.criticalLowAlarmThreshold" type="number" step="0.000001" placeholder="阈值"></el-input>
                  </el-form-item>
                </td>
                <td>
                  <el-form-item prop="criticalLowAlarmSeverity" label-width="0">
                    <el-input v-model="model.criticalLowAlarmSeverity" type="number" :min="0" :max="15"
                              placeholder="级别"></el-input>
                  </el-form-item>
                </td>
                <td>
                  <el-form-item prop="criticalLowAlarmCode" label-width="0">
                    <el-input v-model="model.criticalLowAlarmCode" placeholder="自编码"/>
                  </el-form-item>
                </td>
              </tr>
            </table>
          </template>
        </template>
      </el-form>
    </div>
    <div class="drawer-footer">
      <el-button @click="close()">取消</el-button>
      <el-button type="primary" :loading="isSubmitLoading" @click="save()">提交</el-button>
    </div>
  </el-drawer>
</template>
<script>
  import { createDataElement, updateDataElement } from "@/api/dataElement";
  import { dataEleTypeOptions, modbusDataTypeOptions } from "@/utils/enums.js";
  import pattern from "@/utils/pattern.js";

  export default {
    props: {
      equipType: {
        type: Number,
        default: undefined
      }
    },
    data() {
      const rangeLH = (rule, value, callback) => {
        if (value === "" || isNaN(value)) {
          callback(new Error('请输入正确的量程上限'));
        } else {
          if (this.model.rangeLL !== "") {
            this.$refs.dataForm.validateField("rangeLL");
          }
          callback();
        }
      };
      const rangeLL = (rule, value, callback) => {
        if (value === "" || isNaN(value)) {
          callback(new Error('请输入正确的量程下限'));
        } else if (Number(value) > Number(this.model.rangeLH)) {
          callback(new Error("量程下限不能大于量程上限!"));
        } else {
          callback();
        }
      };
      const caculationTimes = (rule, value, callback) => {
        if (value === "") {
          // callback(new Error(''));
        } else if (Number(value) < 0) {
          callback(new Error("倍数不能为负!"));
        } else {
          callback();
        }
      };
      const modbusDataShift = (rule, value, callback) => {
        if (!value) {
          if (this.model.modbusFuncCode === 3 || this.model.modbusFuncCode === 4) {
            callback(new Error('请输入正确的数据位'));
          }
        } else if (Number(value) > 16 || Number(value) <= 0) {
          callback(new Error("请输入正确的数据位"));
        } else {
          callback();
        }
      };
      return {
        dataEleTypeOptions,
        modbusDataTypeOptions,
        drawerVisible: false,
        isSubmitLoading: false,
        model: {
          portId: undefined,
          equipId: undefined,
          type: 1,
          code: undefined,
          itemCode: undefined,
          description: undefined,
          unit: undefined,
          defaultValue: undefined,
          modbusData: true,
          modbusFuncCode: undefined,
          modbusDataAddr: 0,
          modbusDataType: 1,
          modbusDataShift: undefined,
          absoluteValue: false,
          caculation: false,
          caculationBase: undefined,
          caculationTimes: undefined,
          rangeTrans: false,
          rangeLH: undefined,
          rangeLL: undefined,
          rawDataLH: undefined,
          rawDataLL: undefined,
          reverse: false,
          trueDesc: undefined,
          falseDesc: undefined,
          zeroTolerant: false,
          zeroTolerantValue: undefined,
          jumpTolerant: false,
          jumpTolerantValue: undefined,
          useDCSAlarm: false,
          generateAlarm: true,
          thresholdTolerant: false,
          thresholdTolerantRate: true,
          thresholdTolerantValue: undefined,
          timerThreshold: 0,
          multipleAlarm: false,
          highAlarm: true,
          highAlarmThreshold: null,
          highAlarmSeverity: null,
          highAlarmCode: undefined,
          lowAlarm: true,
          lowAlarmThreshold: null,
          lowAlarmSeverity: null,
          lowAlarmCode: undefined,
          majorHighAlarm: true,
          majorHighAlarmThreshold: null,
          majorHighAlarmSeverity: null,
          majorHighAlarmCode: undefined,
          majorLowAlarm: true,
          majorLowAlarmThreshold: null,
          majorLowAlarmSeverity: null,
          majorLowAlarmCode: undefined,
          criticalHighAlarm: true,
          criticalHighAlarmThreshold: null,
          criticalHighAlarmSeverity: null,
          criticalHighAlarmCode: undefined,
          criticalLowAlarm: true,
          criticalLowAlarmThreshold: null,
          criticalLowAlarmSeverity: null,
          criticalLowAlarmCode: undefined,
          trueAlarm: true,
          falseAlarm: false,
          faultTlerant: undefined,
          timestamp: undefined,
          value: undefined,
          id: undefined,
          realData: undefined
        },
        modelRules: {
          type: [
            { required: true, trigger: "change", message: "请选择数据点类型" }
          ],
          code: [{ required: true, trigger: "blur", message: "请输入位号" }],
          itemCode: [{ required: true, trigger: "blur", message: "请输入指标编码" }],
          // description: [{ required: true, trigger: "blur", message: "请输入描述" }],
          // unit: [{ required: true, trigger: "blur", message: "请输入单位" }],
          modbusFuncCode: [
            { required: true, trigger: "change", message: "请选择功能码" }
          ],
          modbusDataAddr: [
            { required: true, trigger: "blur", message: "请输入数据地址" },
            { pattern: pattern.rule01, message: "请输入正确的数据地址" }
          ],
          modbusDataType: [
            {
              required: true,
              trigger: "change",
              message: "请选择MODBUS解析数据类型"
            }
          ],
          modbusDataShift: [
            { validator: modbusDataShift, trigger: "blur" },
            {
              pattern: pattern.rule02,
              trigger: "blur",
              message: "请输入正确的数据位"
            }
          ],
          caculationBase: [
            { required: true, trigger: "blur", message: "请输入正确基数" }
          ],
          caculationTimes: [
            { required: true, trigger: "blur", message: "请输入正确倍数" },
            { validator: caculationTimes, trigger: "blur" }
          ],
          rangeLH: [
            // { required: true, trigger: "blur", message: "请输入正确量程上限" },
            { validator: rangeLH, trigger: "blur" }
          ],
          rangeLL: [
            // { required: true, trigger: "blur", message: "请输入正确量程下限" },
            { validator: rangeLL, trigger: "blur" }
          ]
          // rawDataLH: [{required: true, trigger: "blur", message: "请输入裸数据上限(PRH)"}],
          // rawDataLL: [{required: true, trigger: "blur", message: "请输入裸数据下限(PRL)"}]

          // zeroTolerantValue: [{ required: true, trigger: "blur", message: "请输入零漂过滤阈值" }],
          // jumpTolerantValue: [{ required: true, trigger: "blur", message: "请输入跳变监测步进" }],
          // thresholdTolerantValue: [{ required: true, trigger: "blur", message: "请输入变化死区阈值" }],
          // highAlarmThreshold: [{ required: true, trigger: "blur", message: "请输入高值告警阈值" }],
          // lowAlarmThreshold: [{ required: true, trigger: "blur", message: "请输入低值告警阈值" }],
          // majorHighAlarmThreshold: [{ required: true, trigger: "blur", message: "请输入高高告警阈值" }],
          // majorLowAlarmThreshold: [{ required: true, trigger: "blur", message: "请输入低低告警阈值" }]
        }
      };
    },
    computed: {
      modbusFuncCodeOptions: function () {
        if (this.equipType === 3 || this.equipType === 5) {
          if (this.model.type === 1) {
            return [6, 16];
          } else {
            return [5, 6, 15, 16];
          }
        } else if (this.equipType === 2 || this.equipType === 4) {
          if (this.model.type === 1) {
            return [3, 4];
          } else {
            return [1, 2, 3, 4];
          }
        } else {
          return [];
        }
      }
    },
    watch: {
      "model.useDCSAlarm": function (newVal) {
        this.model.generateAlarm = !newVal;
      },
      "model.generateAlarm": function (newVal) {
        this.model.useDCSAlarm = !newVal;
      },
      "model.trueAlarm": function (newVal) {
        this.model.falseAlarm = !newVal;
      },
      "model.falseAlarm": function (newVal) {
        this.model.trueAlarm = !newVal;
      }
    },
    mounted() {
    },
    methods: {
      highAlarmChange() {
        if (!this.model.highAlarm) {
          this.model.majorHighAlarm = false;
        }
      },
      lowAlarmChange() {
        if (!this.model.lowAlarm) {
          this.model.majorLowAlarm = false;
        }
      },
      useDCSChange() {
        this.model.thresholdTolerant = false;
        this.model.thresholdTolerantRate = false;
        this.model.thresholdTolerantValue = undefined;
        this.model.timerThreshold = 0;
        this.model.multipleAlarm = false;
      },
      thresholdTolerantChange() {
        this.model.thresholdTolerantRate = false;
        this.model.thresholdTolerantValue = undefined;
      },
      show(row, q) {
        this.resetModal();
        this.isSubmitLoading = false;
        if (row) {
          this.model = row;
        } else {
          this.model.portId = q.portId;
          this.model.equipId = q.equipId;
        }
        this.drawerVisible = true;
        this.$nextTick(() => {
          this.$refs["dataForm"].clearValidate();
        });
      },
      resetModal() {
        this.model = {
          portId: undefined,
          equipId: undefined,
          type: 1,
          code: undefined,
          itemCode: undefined,
          description: undefined,
          unit: undefined,
          defaultValue: undefined,
          modbusData: true,
          modbusFuncCode: undefined,
          modbusDataAddr: 0,
          modbusDataType: 1,
          modbusDataShift: undefined,
          absoluteValue: false,
          caculation: false,
          caculationBase: undefined,
          caculationTimes: undefined,
          rangeTrans: false,
          rangeLH: undefined,
          rangeLL: undefined,
          rawDataLH: undefined,
          rawDataLL: undefined,
          reverse: false,
          trueDesc: undefined,
          falseDesc: undefined,
          zeroTolerant: false,
          zeroTolerantValue: undefined,
          jumpTolerant: false,
          jumpTolerantValue: undefined,
          useDCSAlarm: false,
          generateAlarm: true,
          thresholdTolerant: false,
          thresholdTolerantRate: true,
          thresholdTolerantValue: undefined,
          timerThreshold: 0,
          multipleAlarm: false,
          highAlarm: true,
          highAlarmThreshold: null,
          highAlarmSeverity: null,
          highAlarmCode: undefined,
          lowAlarm: true,
          lowAlarmThreshold: null,
          lowAlarmSeverity: null,
          lowAlarmCode: undefined,
          majorHighAlarm: true,
          majorHighAlarmThreshold: null,
          majorHighAlarmSeverity: null,
          majorHighAlarmCode: undefined,
          majorLowAlarm: true,
          majorLowAlarmThreshold: null,
          majorLowAlarmSeverity: null,
          majorLowAlarmCode: undefined,
          trueAlarm: true,
          falseAlarm: false,
          faultTlerant: undefined,
          timestamp: undefined,
          value: undefined,
          id: undefined,
          realData: undefined
        };
      },
      typeChange() {
        this.$refs["dataForm"].clearValidate();
        console.log(this.model.type);
        if (this.model.type === 2) {
          this.model.modbusDataType = 4;
        } else {
          this.model.modbusDataType = 1;
        }
      },
      save() {
        // 转换数据
        this.model.rawDataLH =
          this.model.rawDataLH === "" || this.model.rawDataLH === null ? null : Number(this.model.rawDataLH);
        this.model.rawDataLL =
          this.model.rawDataLL === "" || this.model.rawDataLL === null ? null : Number(this.model.rawDataLL);
        this.model.rangeLH =
          this.model.rangeLH === "" || this.model.rangeLH === null ? null : Number(this.model.rangeLH);
        this.model.rangeLL =
          this.model.rangeLL === "" || this.model.rangeLL === null ? null : Number(this.model.rangeLL);
        this.model.majorHighAlarmThreshold =
          this.model.majorHighAlarmThreshold === "" || this.model.majorHighAlarmThreshold === null ? null : Number(this.model.majorHighAlarmThreshold);
        this.model.highAlarmThreshold =
          this.model.highAlarmThreshold === "" || this.model.highAlarmThreshold === null ? null : Number(this.model.highAlarmThreshold);
        this.model.lowAlarmThreshold =
          this.model.lowAlarmThreshold === "" || this.model.lowAlarmThreshold === null ? null : Number(this.model.lowAlarmThreshold);
        this.model.majorLowAlarmThreshold =
          this.model.majorLowAlarmThreshold === "" || this.model.majorLowAlarmThreshold === null ? null : Number(this.model.majorLowAlarmThreshold);
        this.model.caculationBase =
          this.model.caculationBase === "" || this.model.caculationBase === null
            ? null
            : Number(this.model.caculationBase);
        this.model.caculationTimes =
          this.model.caculationTimes === "" || this.model.caculationTimes === null
            ? null
            : Number(this.model.caculationTimes);
        console.log(this.model);
        this.isSubmitLoading = true;
        this.$refs["dataForm"].validate(valid => {
          if (valid) {
            //
            if (this.model.id) {
              updateDataElement(this.model)
                .then(() => {
                  this.success();
                })
                .catch(() => {
                  this.isSubmitLoading = false; // 无论成功失败，都把按钮的loading状态取消
                });
            } else {
              createDataElement(this.model)
                .then(() => {
                  this.success();
                })
                .catch(() => {
                  this.isSubmitLoading = false; // 无论成功失败，都把按钮的loading状态取消
                });
            }
          } else {
            this.isSubmitLoading = false;
            this.$message({
              message: this.$t("formIsNotValidMessage"),
              type: "warning"
            });
          }
        });
      },
      success() {
        this.$message({
          message: this.model.id ? "编辑成功" : "添加成功",
          type: "success"
        });
        this.isSubmitLoading = false; // 无论成功失败，都把按钮的loading状态取消
        this.close();
        this.$emit("save");
      },
      close() {
        this.drawerVisible = false;
        this.isSubmitLoading = false; // 无论成功失败，都把按钮的loading状态取消
      }
    }
  };
</script>

<style lang="scss">
  .data-element-drawer {
    .el-drawer__body {
      display: flex;
      flex-direction: column;
      overflow: hidden;
    }

    .drawer-body {
      flex: 1;
      overflow: auto;
      padding-bottom: 56px;

      .el-input,
      .el-select {
        max-width: 360px;
      }

      .el-input-number.is-without-controls {
        max-width: 360px;
      }
    }

    .drawer-footer {
      padding: 10px;
      background-color: #eef1f6;
      text-align: right;

      button {
        min-width: 100px;
      }
    }
  }

  .alert-table {
    margin: 0 auto;
    width: 84%;
    border-collapse: collapse;

    tr {
      th {
        font-size: 14px;
        text-align: center;
        background: #eef1f6;
      }

      td {
      }

      th,
      td {
        border: 1px solid #dfe6ec;
        padding: 8px;
        vertical-align: top;
      }
    }

    .el-form-item {
      margin-bottom: 0;
    }
  }
</style>
